{% include 'QLGL/QLGL_index.html' %}

<div class="am-cf admin-main">
  {% include 'sidebar.html' %}
  <!-- content start -->
  <div class="admin-content">
    <div class="admin-content-body">
      <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">桥梁数据</strong></div>
      </div>
      <div class="am-g" style="position: absolute;height: 100%;right: 0px;left: 260px;width: auto;">

        {% include 'QLGL/QLSJ/QLGL_QLSJ_SIDEBAR.html' %}

        <div class="am-u-sm-10" style="position: absolute;width:auto;right:0;left: 200px;height:85%;overflow-y: scroll;">
          <div class="am-u-sm-12 am-u-md-6">
            <div class="am-btn-toolbar">
              <div class="am-btn-group am-btn-group-xs">
                <button style="margin: 0 5px" type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="back_to()">返回</button>
                <button style="margin: 0 5px" disabled="true" id="add_save" type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="add_save()"><span class="am-icon-plus"></span>保存</button>
                <button style="margin: 0 5px" class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" onclick="delect_all()"><span class="am-icon-trash-o"></span> 删除</button>
              </div>
            </div>
          </div>

          <div class="am-u-sm-12 am-u-md-12 " id="div_bxd" style="background-color: #FFFFFF;margin: 1px auto;padding: 20px;">

            <div class="am-form-group">

              <div class="am-g am-margin-top am-form-group">

                <div class="div_text am-text-right">部件类型：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <span>{{ partstype.0.name }}</span>

                </div>
                <div class="div_text am-text-right">模板：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <div class="am-btn-group" id="position_div">

                  </div>
                </div>
              </div>

            </div>

            <div class="am-form-group">
              <div class="am-g am-margin-top am-form-group">
                <div class="div_text am-text-right">子部件：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <select id='parts_sub_id' name='parts_sub_id' class="input_width" onchange="parts_sub_change()">
                    {% for i in datalist %}

                    <option value={{ i.parts_sub_id }}>{{ i.name }}</option>

                    {% endfor %}
                  </select>
                </div>
                <div class="div_text am-text-right">变参：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <div class="am-btn-group" id="parameter">

                  </div>
                </div>

              </div>
            </div>
            <div class="am-form-group">

              <div class="am-g am-margin-top am-form-group">
                <div class="div_text am-text-right">参数1：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <input type="text" placeholder="整数或A-B格式" name="" id="parameter1" class="input_width" >
                </div>
                <div class="div_text am-text-right">参数2：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <input type="text" placeholder="整数或A-B格式" name="" id="parameter2" class="input_width" >
                </div>

              </div>
            </div>
            <div class="am-form-group">

              <div class="am-g am-margin-top am-form-group">
                <div class="div_text am-text-right">参数3：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <input type="text" placeholder="整数或A-B格式" name="" id="parameter3" class="input_width" >
                </div>

                <div class="div_text am-text-right">编号：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <input type="text" name="parts_num" id="parts_num" class="input_width" disabled="true">
                </div>
              </div>
            </div>
            <div class="am-form-group">
              <div class="am-g am-margin-top am-form-group">
                <div class="div_text am-text-right">名称：</div>
                <div class="am-u-md-3 am-u-end" style="padding-left: 0px;">
                  <input type="text" name="parts_note" id="parts_note" class="input_width" disabled="true">
                </div>
                <div class="am-u-md-4 am-u-end" style="padding-left: 0px;">
                  <button style="float: right;" type="button" class="am-btn am-btn-default am-btn-xs am-text-secondary" onclick="add_number()" id="button_number" value="1">生成编号</button>
                </div>
              </div>
            </div>

            <table id="grid" class="am-table am-table-striped am-table-hover table-main am-table-compact am-text-nowrap">
              <thead>
                <tr>
                  <th class="table-title">序号</th>
                  <th class="table-title">编号</th>
                  <th class="table-title">名称</th>
                  <th class="table-title">删除</th>
                </tr>
              </thead>
              <tbody id="tbody_add">

              </tbody>
            </table>

          </div>



        </div>

      </div>
    </div>
  </div>
</div>
{% include 'footer.html' %}
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->

<!--[if (gte IE 9)|!(IE)]><!-->
<script src="/static/assets/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="/static/assets/js/amazeui.min.js"></script>
<script src="/static/assets/js/amazeui.tree.js"></script>
<script type="text/javascript" src="/static/assets/js/layer.js"></script>
<script src="/static/assets/datatables/amazeui.datatables.min.js"></script>
<script src="/static/assets/dialog/amazeui.dialog.min.js"></script>
<link rel="stylesheet" type="text/css" href="/static/assets/css/amazeui.tree.css" />
<script src="/static/assets/js/app.js"></script>
<style type="text/css">
  .li_a {
    color: #5c5c5c;
  }
  .input_width {
        width: 90%;
      }

      
      .div_text {
        width: 20%;
        padding-right: 1.5rem;
        float: left;
        position: relative;
      }
</style>
<script type="text/javascript">
  $("#collapse-nav1").addClass("am-in");
  $("#qlgl").removeClass("am-collapsed");
  $("#qlglOqlsj").css("color", "#3399CC");
  $("#qlgl").css("color", "#3399CC");
  $("#qlsjOqllb").removeClass("li_a");

  $.ajaxSetup({
        data: {csrfmiddlewaretoken: '{{ csrf_token }}' },
      });
      var bridge_id = {{ bridge_id | safe }};
      var parts_code = {{ parts_code | safe }};
      function delect_all() {
        $("#tbody_add").empty();
      }

      function add_save(){
        var parameter1 = $("#parameter1").val();
        var parameter2 = $("#parameter2").val();
        var parameter3 = $("#parameter3").val();
        var parts_num = $("#parts_num").val(); //编号
        var parts_note = $("#parts_note").val(); //名称
        var position = $("input:radio[name='position']:checked").val(); //模板
        var parts_sub_id = $("#parts_sub_id option:selected").val();
        var all_information = [];
        $("#tbody_add tr").each(function(i){
          var one_information = {};
          var member_name = $(this).children('td').eq(1).text();
          var notes1 = $(this).children('td').eq(2).text();
          all_information.push({"member_name":member_name,"notes1":notes1});
        })

        // console.log(all_information);
        // console.log(JSON.stringify(all_information));

        $.ajax({
          "url": "/QLXJ_QLLB_GJXX_suParterSave/",
          "data":{"bridge_id":bridge_id,"parts_code":parts_code,"parameter1":parameter1,"parameter2":parameter2,"parameter3":parameter3,"keywords":parts_num,"notes":parts_note,"position":position,"all_information":JSON.stringify(all_information),"sub_part_id":parts_sub_id},
          "datatype": "json",
          "type": "post",
          "async": "false"
        }).success(function(data) {
          if(data.status == 1) {
            message_layer(data.message)
            back_to();
          } else {
            AlertMSG(data.message)
          }
        }).error(function(data) {
          AlertMSG("保存失败！")
        });
      }
      function add_number(){
        var parameter = $("input:radio[name='param_num']:checked").val(); //变参
        var parameter1 = $("#parameter1").val();
        var parameter2 = $("#parameter2").val();
        var parameter3 = $("#parameter3").val();
        var parts_num = $("#parts_num").val(); //编号
        var parts_note = $("#parts_note").val(); //名称
        var position1 = $("input:radio[name='position']:checked").val(); //模板
        var position2 = $("input:radio[name='position']:checked").attr("attr1"); //模板
        var number = [parameter1, parameter2, parameter3];
        var number_new = [
          [],
          [],
          []
        ];
        var message = "";
        var reg = /^[0-9]{1,3}(-[0-9]{1,3})?$/
        for(var i = 0; i < parameter; i++) {
          if(number[i] == "") {
            var j = i + 1
            message = "参数" + j + "不能为空！";
            AlertMSG(message);
            return;
          }else if(!number[i].match(reg)){
            var j = i + 1
            message = "参数" + j + "只能整数或A-B格式！";
            AlertMSG(message);
            return;
          } else {
            var BB = []
            if(number[i].indexOf("-") > 0) {
              var AA = number[i].split("-");

              if(parseInt(AA[0]) < parseInt(AA[1])) {

                for(var k = parseInt(AA[0]); k <= parseInt(AA[1]); k++) {
                  BB.push(k)
                }
              } else {
                console.log(AA[0])
                console.log(AA[1])
                var j = i + 1;
                message = "参数" + j + "中‘-’后数字必须大于‘-’前数字！";
                AlertMSG(message);
                return;
              }

            } else {
              BB.push(number[i])
            }
            number_new[i] = BB
          }
        }
        if(message != "") {
          AlertMSG(message)
        } else {
          if($("#button_number").val() == 1) {
            $("#button_number").val(2);
            $("#button_number").text("重新填写");
            $("#div_bxd input").attr("disabled", true);
            $("#div_bxd select").attr("disabled", true);
            $("#add_save").attr("disabled", false);
            $("#tbody_add").empty();
            if(position1.toLowerCase() == "none") {
              var parts_num_new = parts_num.replace('%p-', "");
              var parts_num_new = parts_num_new.replace('-%p', "");
              var parts_note_new = parts_note.replace('%p', "");
            } else if(position1.toLowerCase() == "l") {
              var parts_num_new = parts_num.replace('%p', position1);
              var parts_note_new = parts_note.replace('%p', position2);
            } else if(position1.toLowerCase() == "r") {
              var parts_num_new = parts_num.replace('%p', position1);
              var parts_note_new = parts_note.replace('%p', position2);
            }

            var kk = 1;
            for(var m = 0; m < number_new[0].length; m++) {
              var parts_num_new_0 = parts_num_new.replace('%1', number_new[0][m]);
              var parts_note_new_0 = parts_note_new.replace('%1', number_new[0][m]);
              if(number_new[1].length > 0) {
                for(var n = 0; n < number_new[1].length; n++) {
                  var parts_num_new_1 = parts_num_new_0.replace('%2', number_new[1][n]);
                  var parts_note_new_1 = parts_note_new_0.replace('%2', number_new[1][n]);
                  if(number_new[2].length > 0) {
                    for(var p = 0; p < number_new[2].length; p++) {
                      var parts_num_new_2 = parts_num_new_1.replace('%3', number_new[2][p]);
                      var parts_note_new_2 = parts_note_new_1.replace('%3', number_new[2][p]);
                      $("#tbody_add").append('<tr id=tbody_tr_' + kk + '><td>' + kk + '</td><td>' + parts_num_new_2 + '</td><td>' + parts_note_new_2 + '</td><td><div class="am-btn-toolbar"><div class="am-btn-group am-btn-group-xs"><button class="am-btn am-btn-default am-btn-xs am-text-secondary button_click" onclick="delect_one(\'tbody_tr_' + kk + '\')">删除</button></div></div></td></tr>');
                      kk = kk + 1;
                    }
                  } else {
                    $("#tbody_add").append('<tr id=tbody_tr_' + kk + '><td>' + kk + '</td><td>' + parts_num_new_1 + '</td><td>' + parts_note_new_1 + '</td><td><div class="am-btn-toolbar"><div class="am-btn-group am-btn-group-xs"><button class="am-btn am-btn-default am-btn-xs am-text-secondary button_click" onclick="delect_one(\'tbody_tr_' + kk + '\')">删除</button></div></div></td></tr>');
                    kk = kk + 1;
                  }
                }
              } else {
                $("#tbody_add").append('<tr id=tbody_tr_' + kk + '><td>' + kk + '</td><td>' + parts_num_new_0 + '</td><td>' + parts_note_new_0 + '</td><td><div class="am-btn-toolbar"><div class="am-btn-group am-btn-group-xs"><button class="am-btn am-btn-default am-btn-xs am-text-secondary button_click" onclick="delect_one(\'tbody_tr_' + kk + '\')">删除</button></div></div></td></tr>');
                kk = kk + 1;
              }
            }
          } else {
            $("#button_number").val(1);
            $("#button_number").text("生成编号");
            $("#div_bxd select").attr("disabled", false);
            $("#div_bxd input").attr("disabled", false);
            $("#add_save").attr("disabled", true);
            $("#parts_num").attr("disabled", true);
            $("#parts_note").attr("disabled", true);
            check();
          }

        }

      }

      function delect_one(id) {
        $("#" + id).remove();
      }

      $(document).ready(function() {
          //验证桥梁类型是否具备子部件配置
          var subParts = $("#parts_sub_id option").length;
          if (subParts == 0)
          {
              AlertMSG("未定义该桥型子部件规则");
              document.getElementById("main").disabled = true;
              return;
          }
        $("input:radio[name='position']").eq(0).attr("checked", true);
      });
      var message;

      function parts_sub_change() {
        //判断子部件是否有内容,若没有定义子部件规则，则不用判断
        if ($("#parts_sub_id option").length<1) return;
        var parts_sub_id = $("#parts_sub_id option:selected").val();
        $.ajax({
          "url": "/QLXJ_QLLB_GJXX_suParter/?parts_sub_id=" + parts_sub_id + "",
          "datatype": "json",
          "type": "get",
          "async": "false"
        }).success(function(data) {

          if(data.status == 1) {
            $("#parameter").empty();
            message = data.data;
            for(var i = 0; i < data.data.length; i++) {
              $("#parameter").append('<label class="am-radio-inline"><input type="radio" name="param_num" id="parameter_' + data.data[i].param_num + '" onclick=bc_change(' + i + ') value=' + data.data[i].param_num + ' data-am-ucheck >' + data.data[i].param_num + '</label>')
              $("input:radio[value=" + data.data[i].param_num + "]").uCheck('check');
            }
            // $("#parts_num").val("" + data.data[0].parts_num + "");
            // $("#parts_note").val("" + data.data[0].parts_note + "");

            $("input:radio[value=" + data.data[0].param_num + "]").uCheck('check');
            bc_change(0)
            // check();

            
          } else {
            AlertMSG(data.message)
          }
        }).error(function(data) {
          AlertMSG("读取子部件信息失败！")
        });
      }
      parts_sub_change()

      function bc_change(i) {
        $("#position_div").empty();
        for(var j=0;j<message[i].position.length;j++){
          $("#position_div").append('<label class="am-radio-inline"> <input type="radio" name="position" attr1="'+message[i].position[j].name+'" value="'+message[i].position[j].key+'" data-am-ucheck>'+message[i].position[j].name+'</input></label>');
          $("input:radio[value=" + message[i].position[j].key + "]").uCheck('check');
        }
        $("input:radio[value=" + message[i].position[0].key + "]").uCheck('check');

        $("#parts_num").val("" + message[i].parts_num + "");
        $("#parts_note").val("" + message[i].parts_note + "");
        
        check();
      }

      function back_to() {
        window.history.go(-1);
      }



      
      function check(){
        $("#parameter1").attr("disabled",false);
        $("#parameter2").attr("disabled",false);
        $("#parameter3").attr("disabled",false);
        var param_num = $("input:radio[name='param_num']:checked").val();
        for(var j=3;j>param_num;j--){
          $("#parameter"+j+"").attr("disabled",true);
        }
      }
// message_layer(data.message)
function message_layer(message){
    layer.msg(message, {
    time: 2000 //2秒关闭（如果不配置，默认是3秒）
  }); 
}


      var AlertMSG = function(msg) {
        AMUI.dialog.alert({
          title: '错误提示',
          content: msg,
          onConfirm: function() {
            console.log('close');
          }
        });
      }
</script>

</body>

</html>